<template>
    <div class="search"></div>
    <div class="echart">
      <Chart :width=store.echarts32.width :height=store.echarts32.height :options="store.echarts32.options"></Chart>
    </div>
    <div class="table">
      <div class="top">
        <div class="left"> 线索数量：200，商机数量：200，客户数量：200，订单数量：200</div>
        <div class="right"></div>
      </div>
      <a-table
    class="ant-table-striped"
    size="large"
    :columns="columns"
    :data-source="data"
    :row-class-name="(_record, index) => (index % 2 === 1 ? 'table-striped' : null)"
    bordered
  />
    </div>
    <div class="reg">
      <p>Copyright © www.AxureUX.com, All Rights Reserved.</p>
      <p>专业的交互原型素材原创分享平台</p>
    </div>
  </template>
  
  <script setup>
  import { ref, reactive, onMounted } from 'vue';
  import Chart from '../../components/MyEcharts'
  import { useStore } from '../../store/zsz/index'
  const store = useStore()
  const columns = [
  { title: '排名', dataIndex: 'name' },
  { title: '员工姓名', dataIndex: 'bumen' },
  { title: '所在部门', dataIndex: 'count' },
  { title: '线索数量', dataIndex: 'xiansuo' },
  { title: '商机数量', dataIndex: 'kehu' },
  { title: '客户数量', dataIndex: 'shangji' },
  { title: '订单数量', dataIndex: 'dingdan' },
];
const data = [
  {
    key: '1',
    name: '1',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '2',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '3',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '4',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '5',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '6',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '7',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '8',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '9',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '10',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '11',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '12',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '13',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '14',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  },
  {
    key: '1',
    name: '15',
    bumen: '赵小铡',
    count: '销售一部',
    xiansuo: 200,
    kehu: 200,
    shangji: 200,
    dingdan: 200,
  }
]
  </script>
  
  <style lang='scss' scoped>
  .search {
    height: 110px;
    background-color: white;
  }
  
  .echart {
    height: 440px;
    background-color: white;
    margin: 14px 0;
  }
  
  .table {
    padding: 0px 20px;
    height: 780px;
    background-color: white;
    width: 100%;

  
    .top {
      height: 80px;
      line-height: 80px;
      color: #666666;
    }
  
    .main {
      height: calc(900px - 80px);
    }
  }
  
  .reg {
    text-align: center;
    color: #cccccc;
    padding-top: 30px;
    margin-top: 20px;
    height: 140px;
    font-size: 14px;
  }
  
  
  
  
  
  
  </style>